<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div>
    <p>1</p>
    <p>2</p>
    <p class="target">3333</p>
    <p>4</p>
    <p>5</p>
  </div>

  <script>
    const target = document.querySelector(".target")
    // 获取节点的文本内容 都是字符串类型
    // console.log(target.innerText + 10)
    // 设置节点的文本内容
    // target.innerText = "666"
    // console.log(target.parentNode.innerText)

    target.addEventListener("click", function () {
      // 1 先创建一个节点
      // const p = document.createElement("p")
      // p.innerText = Date.now()
      // 2 放哪里 div里面的子元素的列表的开头
      // target.parentNode.prepend(p)
      // 3 放哪里 div里面的子元素的列表的结尾
      // target.parentNode.append(p)


      // 剪切！！  append(已经存在的元素， 剪切的功能！！ )
      // target.parentNode.append(target.parentNode.children[0])

      // 删除
      target.remove()
    })

  </script>

</body>

</html>